<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script>

    var div1 = document.createElement("div");
    div1.setAttribute("class","col s12 m6");
    // div1.innerHTML = ""
    var div2 = document.createElement("div");
    div2.setAttribute("class","card horizontal");
    div2.innerHTML = "<div class=\"card-image col s12 m6\">\n" +
        "                <img class=\"responsive-img\" src=\"../img/main1.jpg\">\n" +
        "            </div>";
    var div3 = document.createElement("div");
    div3.setAttribute("class","card-stacked col s12 m6 toDetail");
    div3.setAttribute("name",id);
    var div4 = document.createElement("div");
    div4.setAttribute("class","card-content");
    var span = document.createElement("span");
    span.setAttribute("class","card-title flow-text");
    span.innerHTML = title;
    var p = document.createElement("p");
    p.innerHTML = content;
    var div5 =document.createElement("div");
    div5.setAttribute("class","card-action col s12 m6");
    div5.innerHTML = "<a style=\"vertical-align: bottom\">进入问题</a>";
    //开始拼接
    div4.appendChild(span);
    div4.appendChild(p);
    div3.appendChild(div4);
    div3.appendChild(div5);
    div2.appendChild(div3);
    div1.appendChild(div2);
    document.getElementsByClassName("container")[0].appendChild(div1);
</script>
</body>
</html>